<template>
  <div>
      <img :src="detail.pic" alt="">
      <p>{{detail.title}}</p>
  </div>
</template>

<script>
import { onMounted, toRefs,reactive } from '@vue/runtime-core'
import {useRouter} from 'vue-router'
import axios from 'axios'
export default {
    /* mounted() {
        console.log(this.$route.query)
    }, */
    setup(){
        const state = reactive({
            detail:{}
        })
        const router = useRouter()
        onMounted(()=>{
            console.log(router.currentRoute.value.query);
            var {id}=router.currentRoute.value.query;
            axios.get(`http://122.112.161.135:4000/api/movieDetail?id=${id}`).then(res=>{
                console.log(res.data);
                state.detail =res.data.res[0];
            })
        })
        const refState = toRefs(state);
        return{
            ...refState
        }
    }
}
</script>

<style>

</style>